<template>
  <div id="app">
    <div class="container">
      <Side class="left-side" />
      <div class="content">
        <router-view />
      </div>
      <!-- <Content class="content"
               :html="html">

      </Content> -->
      <!-- <Ctrl class="right-side"
            @changeHtml="getHtml"></Ctrl> -->
    </div>
  </div>
</template>

<script>
  import Side from '@/components/side'
  import Content from '@/components/content'
  export default {
    name: 'App',
    data () {
      return {
        html: ''
      }
    },
    components: {
      Side,
      Content
    }
  }
</script>

<style scoped>
  #app {
    height: 100%;
  }
  .container {
    /* min-width: 1200px; */
    height: 100%;
    overflow: hidden;
  }
  .left-side {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 240px;
    height: 100%;
    border-right: 1px solid #d5dce0;
  }

  .content {
    margin: 0px 380px 0px 240px;
    height: 100%;
    /* background: red; */
  }
</style>
